<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>票友直销</title>
		<script src="js/mui.min.js"></script>
		<link href="css/mui.min.css" rel="stylesheet" />
		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>
	</head>

	<body>
		<!--<header class="mui-bar mui-bar-nav">
		    <h1 class="mui-title">票友直销</h1>
		    <a id="info" class="mui-icon mui-icon-more mui-pull-right"></a>
		</header>-->

		<header class="mui-bar mui-bar-nav">
			<h1 class="mui-title">首页</h1>
		</header>

		<nav class="mui-bar mui-bar-tab">
			<a class="mui-tab-item mui-active" href="#home">
				<span class="mui-icon mui-icon-home"></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a class="mui-tab-item" href="javascript:;">
				<span class="mui-icon mui-icon-camera"></span>
				<span class="mui-tab-label">摄像头</span>
			</a>
			<a class="mui-tab-item" href="#servicer">
				<span class="mui-icon mui-icon-person"></span>
				<span class="mui-tab-label">服务</span>
			</a>
		</nav>

		<div class="mui-content">
			<style>
				#home a {
					border: 1px solid #ccc;
					border-radius: 5px;
				}
				#home span.mui-icon {
					font-size: 60px;
				}
			</style>
			<div id="home" class="mui-control-content mui-active">
				
				<div class="mui-content">
				    <ul class="mui-table-view mui-grid-view mui-grid-9" style="margin-top: 20px;">
					<li class="mui-table-view-cell mui-media mui-col-xs-6 mui-col-sm-6">
						<a href="javascript:;" id="wallet">
							<span class="mui-icon mui-icon-upload"></span>
							<div class="mui-media-body">我的钱包</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6 mui-col-sm-6">
						<a href="javascript:;" id="achievement">
							<span class="mui-icon mui-icon-email"><span class="mui-badge mui-badge-red">5</span></span>
							<div class="mui-media-body">我的成绩</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6 mui-col-sm-6">
						<a href="javascript:;" id="order">
							<span class="mui-icon mui-icon-chatbubble"></span>
							<div class="mui-media-body">销售订单</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6 mui-col-sm-6">
						<a href="javascript:;" id="customer">
							<span class="mui-icon mui-icon-person"></span>
							<div class="mui-media-body">客户管理</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6 mui-col-sm-6">
						<a href="javascript:;" id="tools">
							<span class="mui-icon mui-icon-search"></span>
							<div class="mui-media-body">发票开具</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6 mui-col-sm-6">
						<a href="javascript:;" id="service">
							<span class="mui-icon mui-icon-phone"></span>
							<div class="mui-media-body">申请售后</div>
						</a>
					</li>
				</ul>
				</div>
				
				
			</div>
			<div id="servicer" class="mui-control-content">
				<div id="">
					321
				</div>
			</div>
		</div>

		<script>
			mui.init()
			mui.ready(function() {
				var h1Node = document.getElementsByTagName('h1')[0];
				mui('.mui-bar-tab').on('tap', 'a', function() {
					var tabTxt = this.innerText;
					h1Node.innerText = tabTxt;
				});	
				mui('#home a').each(function(i){
					var idNode = this.getAttribute('id'),
						href = idNode + '.html';
					document.getElementById(idNode).addEventListener('tap',function(){
						openWindow(href);
					});
				});
				function openWindow(url) {
					mui.openWindow(url,url,{})
				}
				
				window.addEventListener('goHme',function(e){
					var cur = e.event.detail;
					
					
				});
				
				
				
				
			});
			
			
		</script>

	</body>

</html>